.diva{
    font-size: 24px;
}
/* 所有元素点击都会触发该激活样式的加载 */
/*:active{*/
/*    color: brown;*/
/*}*/
.diva:active{
    color: brown;
}
/* 当 .diva 被激活时 span 为紫色 */
/*.diva:active>span{*/
/*    color: blueviolet;*/
/*}*/
/* .diva 的子元素 span 被点击时 为 紫色 */
.diva>span:active{
    color: blueviolet;
}
input[type=button]:active{
    color: orchid;
}
.pdom{
    font-size: 20px;
}
.pdom:hover{
    color: cornflowerblue;
}
.adom{
    color: brown;
}
/* 下述选择器在现在的浏览器规则下，功能等同关于上述选择结果 */
/*.adom:link{*/
/*    color: brown;*/
/*}*/
.adom:visited{
    color: orange;
}
input[type=text]:hover{
    color: brown;
}
input[type=text]:focus{
    color: blueviolet;
}
.title,.info{
    font-size: 20px;
    color: brown;
}
.title>span{
    font-size: 26px;
    font-weight: bolder;
}
.title::first-letter{
    font-size: 26px;
    font-weight: bolder;
}
.info::first-line{
    font-size: 24px;
    font-weight: bolder;
}
.info::selection{
    color: olivedrab;
}
.paragraph{
    font-size: 24px;
}
.paragraph::before{
    content: "★";
    color: brown;
}
.paragraph::after{
    content: "%%%%";
    color: blueviolet;
}
/*.p-list>p::before{*/
/*    content: "★ ";*/
/*    color: cornflowerblue;*/
/*}*/
.p-list>p{
    /*将当前元素描述为 list-item => li */
    display: list-item;
    /*文本左边的间距*/
    margin-left: 20px;
}
.p-list>p::marker{
    content: "★ ";
    color: cornflowerblue;
}
ul>li::marker{
    content: "😊 ";
    color: orchid;
}
ol{
    /*序号重置*/
    counter-reset: num;
}
ol>li{
    /*序号递增*/
    counter-increment: num;
}
ol>li::marker{
    /*counter(序号名) 序号引用 */
    content: counter(num)". ";
}
ol ol{
    counter-reset: num2;
}
ol ol>li{
    counter-increment: num2;
}
ol ol>li::marker{
    content: counter(num)"-"counter(num2)". ";
}
